<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" > 

<html>
<head>
<base href="<%=basePath%>">
<title>疾病模拟查询</title>
<link rel="stylesheet" type="text/css" href="./js/bootstrap-3.3.5-dist/css/bootstrap.css" />
<link href="./js/metisMenu/metisMenu.min.css" rel="stylesheet">
<link href="./css/sb-admin/sb-admin-2.css" rel="stylesheet">
<link rel="stylesheet" href="./js/font-awesome/css/font-awesome.min.css">
<link href="./css/base.css" rel="stylesheet">
<link rel="stylesheet" href="./js/bootstrap-table/bootstrap-table.min.css">
<link rel="stylesheet" href="./js/bootstrap-multiselect/bootstrap-multiselect.css"/>
<link rel="stylesheet" href="./js/bootstrap-3.3.5-dist/css/bootstrap-datetimepicker.css">

<script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="./js/bootstrap-3.3.5-dist/js/bootstrap.js"></script>
<script src="./js/bootstrap-table/bootstrap-table-all.js"></script>
<script src="./js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" src="./js/metisMenu/metisMenu.js"></script>
<script src="./js/bootstrap-multiselect/bootstrap-multiselect.js"></script>
<script src="./js/bootstrap-3.3.5-dist/js/bootstrap-datetimepicker.js"></script>
<script src="./js/bootstrap-3.3.5-dist/js/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="./js/bootstrap-jquery-plugin/jquery.bootstrap.js"></script>
<script type="text/javascript" src="./js/common.js"></script>
<script type="text/javascript" src="./js/xss.js"></script>
</head>
<body>
<jsp:include page="../template/head.jsp" />
<jsp:include page="../template/leftnav.jsp" />
<div id="page-wrapper">
	<div>
		<h1>疾病模拟查询</h1>
	</div>
	<div class="content">
		<form class="form-inline">
			<div class="form-group">
				<label for="accountId">部位名称：</label>
				<input type="text" id="parts" class="form-control" placeholder="请输入部位名称" onkeyup="filters(this)" onchange="filters(this)">
			</div>
			<div class="form-group">
				<label for="feebackID">症状名称：</label>
				<input type="text" id="symptom" class="form-control" placeholder="请输入症状名称" onkeyup="filters(this)" onchange="filters(this)">
			</div>
			<div class="form-group">
				<button class="btn  search-btn" id="search" style="display:none">搜索</button>
				<button class="btn  search-btn" id="research" style="display:none">再搜索</button>
				<button id="reset" class="btn btn-default">重置</button>
			</div>
		</form>
		 <table id="table" data-toolbar="#toolbar" data-toggle="table" data-row-style="rowStyle" data-classes="table  table-no-bordered"
	           data-minimum-count-columns="2"  data-cache="false" data-pagination="true"  data-striped="data-striped"
	           data-page-list="[5, 10, 20, 50]"  data-query-params="tableQueryParams" style="word-break:break-all;"
	           data-side-pagination="server" data-page-size=10 >
	           <thead>
				<tr class="headTr">
					<th data-field="illness" data-width="13%" >疾病名</th>
					<th data-field="symptoms" data-width ="27%" data-formatter="symptomFormatter">症状名</th>
					<th data-field="levelOneSubject" data-width ="10%">一级</th>
					<th data-field="levelTwoSubject" data-width ="10%">二级</th>
					<th data-field="parts" data-width ="10%">部位</th>
					<th data-field="diseaseStartTime" data-width ="10%" data-formatter="ageFormatter">年龄段</th>
					<th data-field="createTime" data-width ="10%" data-formatter="dateFormatter">创建日期</th>
					<th data-field="operation" data-width ="10%" data-formatter="operFormatter">操作</th>
				</tr>
			</thead>
	    </table>
	    <div id="illOperTemp" style="display:none">
			<ul class="list-inline">
				<li role="presentation"><a role="button" class="btn detail—btn">详情</a></li>
			</ul>
		</div>
    </div>
</div>
<script>
var ids =  [1,2,3,4,29,32,33];

$(function () {
	
	if(ids.length>0){
		$("#research").show();
	}else{
		$("#search").show();
	}
	
	"use strict";
	
	$('#table').bootstrapTable('refresh', {
		 method: 'post',
		query : {
			offset: 0
		},
		url : "./illness/getAllIllnessRecort.spring",
		silent : true
	});

	$('#search').on('click', function (e) {
		e.preventDefault();
		searchOrder();
	});
	
	$('#research').on('click', function (e) {
		e.preventDefault();
		searchOrder();
	});
	
});

function tableQueryParams(params) {
	var queryObj = getQueryObject();
	var newParams = $.extend(params,queryObj);
	return newParams;
}
	
function getQueryObject(){
	var queryObj;
	var parts =$.trim($("#parts").val());
	var symptom =$.trim($("#symptom").val());
	
	var queryObj = {
		isSearch: true,
		parts: parts,
		symptom: symptom,
		ids: ids ? ids.join(",") : null,
	}
	
	if(parts ==""){
		delete queryObj.parts;
	}
	
	if(symptom ==""){
		delete queryObj.symptom;
	}
	return queryObj;
}
	
function searchOrder(){
	var queryObj = getQueryObject();
	if(ids.length>0){
		$('#table').bootstrapTable('refresh', {
		 method: 'post',
			query : {
				offset: 0
			},
			url : "./illness/queryIllnessRecortBySymptomAndIllnessId.spring",
			silent : true
		});
	}else{
		$('#table').bootstrapTable('refresh', {
		 method: 'post',
			query : {
				offset: 0
			},
			url : "./illness/queryIllnessRecortBySymptom.spring",
			silent : true
		});
	}
	
}

function symptomFormatter(value,row){
	var s = '';
	for(var i=0;i<value.length;i++){
		console.log(value[i].symptom);
		s = s +"、" + value[i].symptom;
	}
	var t = s.substring(1,s.length) 
	return t;
}

function operFormatter(value, row) {
	var operTemp = $("#illOperTemp").clone();
	var lis = operTemp.find("ul li");
	lis.eq(0).find("a").attr("href", "./jsp/illness/illnessdetail.jsp?illName="+row.illness);
	lis.eq(1).find("a").attr("onClick", "deleteFeeback(\""+row.feebackID+"\")");
	return operTemp.html();
}

function dateFormatter(value, row){
	if(value!=null){
		return getSmpFormatDateByLong(value, true);
	}else{
		return '-';
	}
	
}

function ageFormatter(value, row){
	if(value==null || row.diseaseEndTime==null){
		return '-';
	}else{
		return value+"~"+row.diseaseEndTime+"岁";
	}
}

</script>
</body>
</html>